<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>作业批改</title>
    <link href="/assets/images/favicon.ico" rel="icon">
    <link rel="stylesheet" href="/assets/libs/layui/css/layui.css"/>
    <link rel="stylesheet" href="/assets/module/admin.css?v=318"/>

    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="/assets/libs/layui/layui.js"></script>
    <script type="text/javascript" src="/assets/js/common.js?v=318"></script>
    <style>
        /* 搜索栏样式 */
        .search-bar {
            padding-top: 10px;
        }
        .layui-form-item .layui-inline {
            margin-bottom: 10px;
        }
        .layui-table-page {
            position: relative;
            margin-top: 0px; /* 可根据需要调整上边距 */
        }
        .layui-table-box {
            margin-bottom: 10px;
        }
        .layui-form-item .layui-inline {
            margin-bottom: 10px;
        }
        /* Added some margin and padding for better form spacing */
        .layui-form-item {
            margin-bottom: 15px;
        }
        .layui-form-label {
            width: 100px;
        }
        .layui-input-inline {
            width: 200px;
        }
        .layui-card-body {
            margin-top: 25px;
            padding-top: 25px;
        }
        .layui-table {
            width: 100%;
        }

    </style>
    <script type="text/javascript">
        var url = window.location.pathname.substring(1);
        var item = url.split("/");
        var C = item[0];
        var A = item[1];
        var cUrl = "/" + C;
    </script>
</head>
<body>
<div>
    <div class="layui-card">
        <div class="layui-card-header search-bar">
            <form class="layui-form">
                <div class="layui-form-item">
                    <!-- 学生姓名类型 -->
                    <div class="layui-inline">
                        <label class="layui-form-label">学生姓名</label>
                        <div class="layui-input-inline">
                            <input id="studentName" name="student" type="text" placeholder="请输入学生姓名" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <!-- 类型 -->
                    <div class="layui-inline">
                        <label class="layui-form-label">作业类型</label>
                        <div class="layui-input-inline">
                            <input id="tbType" type="text" name="homeworkType" placeholder="请输入作业类型" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <!-- 批阅是否 -->
                    <div class="layui-inline">
                        <label class="layui-form-label">批阅是否</label>
                        <div class="layui-input-inline">
                            <select id="isReadSelect"name="select" class="layui-input">
                                <option value="">所有</option>
                                <option value="1">是</option>
                                <option value="0">否</option>
                            </select>
                        </div>
                    </div>
                    <!-- 按钮区域 -->
                    <div class="layui-inline">
                        <div class="layui-input-inline" style="width: auto;">
                            <button id="search" class="layui-btn" lay-submit="" lay-filter="searchForm">
                                <i class="layui-icon layui-icon-search"></i> 查询
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>

        <div class="layui-card-body">
            <table class="layui-hide" id="tableList" lay-filter="tableList"></table>
            <div class="layui-table-page"></div> <!-- 将分页栏放置在这里 -->
            <script th:inline="none">
                layui.use(['table', 'form', 'layer', 'laydate', 'jquery'], function () {
                        var $ = layui.jquery;
                        var layer = layui.layer;
                        var form = layui.form;
                        var table = layui.table;
                        var laydate = layui.laydate;
                        var projectNameList = [];
                        var classesNameList = [];
                        var chargerName;

                        // 格式化日期函数
                        function formatDate(dateStr) {
                            var date = new Date(dateStr);
                            var year = date.getFullYear();
                            var month = (date.getMonth() + 1).toString().padStart(2, '0');
                            var day = date.getDate().toString().padStart(2, '0');
                            var hour = date.getHours().toString().padStart(2, '0');
                            var minute = date.getMinutes().toString().padStart(2, '0');
                            var second = date.getSeconds().toString().padStart(2, '0');
                            return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
                        }

                        table.render({
                            elem: '#tableList',
                            url: '/homeworkdetail/list',  // 请求作业细节列表数据的接口
                            defaultToolbar: ['filter', 'exports', 'print', {
                                title: '提示',
                                layEvent: 'LAYTABLE_TIPS',
                                icon: 'layui-icon-tips'
                            }],
                            title: '作业数据',
                            cols: [[
                                {title: '序号', width: 60, templet: function (d) { return d.LAY_TABLE_INDEX + 1; }},
                                {
                                    title: '作业要求', width: 200, templet: function (d) {
                                        return d.homework.title;
                                    }
                                },
                                {
                                    title: '作业类型', width: 150, templet: function (d) {
                                        return d.homework.homeworkType;
                                    }
                                },
                                {
                                    title: '学生姓名', width: 100, templet: function (d) {
                                        return d.student.name;
                                    }
                                },
                                {field: 'submitDate', title: '提交时间', width: 180,templet: function(d) {
                                        return formatDate(d.submitDate);
                                    }},
                                {
                                    field: 'isRead', title: '是否批阅', width: 100, templet: function(d) {
                                        return d.isRead === 1? '是' : '否';  // 判断 isRead 值，1为是，其他为否
                                    }
                                },
                                {field: 'score', title: '分数', width: 80, templet: function(d) {
                                        // 判断 score 是否为空，如果为空则返回空字符串
                                        return d.score? d.score : '';  // 如果 score 为空，返回空字符串
                                    }
                                },
                                {
                                    field: 'readDate', title: '批阅时间', width: 180, templet: function(d) {
                                        // 如果 readDate 为 null，则返回空字符串
                                        return d.readDate? formatDate(d.readDate) : '';  // 判断 readDate 是否为空
                                    }
                                },
                                {
                                    title: '操作',
                                    width: 100,
                                    templet: function(d) {
                                        // 判断作业是否批阅，显示相应的操作按钮
                                        if (d.isRead === 1) {
                                            return '<button id="retryhomwork" class="layui-btn layui-btn-warm layui-btn-xs" data-id="' + d.id + '" onclick="retryHomework(this)">重批</button>' ;
                                        } else {
                                            return '<button id="edithomwork" class="layui-btn layui-btn-normal layui-btn-xs" data-id="' + d.id + '" onclick="editHomework(this)">批改</button>';
                                        }
                                    }
                                }
                            ]],
                            page: true,
                            limit: 50,
                            limits: [50, 100, 150, 200],
                            id: 'tableList',
                            done: function (res, curr, count) {
                                // 打印后台返回的数据
                                console.log("返回的数据：", res.data);
                                $('.layui-table').css("width", "100%");
                                $("th[data-field='delete']").css("border-right", 'none');
                            }
                        });

                        // 初始化项目和班级数据
                        $(document).ready(function () {
                            $.ajax({
                                url: '/user/findExpertName',
                                type: 'GET',
                                success: function (data) {
                                    if (data.code === 0) {
                                        chargerName = data.data;
                                        console.log(chargerName);
                                    } else {
                                        console.log(data.msg);
                                    }
                                    console.log("fff");
                                },
                                error: function (xhr, status, error) {
                                    console.error("请求失败: " + status + ", " + error);
                                }
                            });
                        });

                        // 修改 editHomework 方法，获取 ID
                        window.editHomework = function(button) {
                            var id = $(button).data('id'); // 获取按钮的 data-id 属性
                            console.log('批改作业的 ID:', id);
                            window.chargerName=chargerName;
                            layer.open({
                                type: 2,
                                title: '批改',
                                content: '/homeworkdetail/form?id=' + id, // 将作业 ID 传递给表单
                                fixed: false,
                                maxmin: true, // 启用最大化按钮
                                area: ['80%','80%'], // 设置全屏
                                shade: 0.8, // 遮罩层透明度（可选）
                            });
                        };
                        // 重批操作的函数
                        window.retryHomework = function(button) {
                            // 实现重批逻辑
                            var id = $(button).data('id'); // 获取按钮的 data-id 属性
                            console.log('批改作业的 ID:', id);
                            window.chargerName=chargerName;
                            layer.open({
                                type: 2,
                                title: '批改',
                                fixed: false,
                                maxmin: true,
                                area: ['80%','80%'],
                                shade: 0.8, // 遮罩层透明度（可选）
                                content: '/homeworkdetail/form?id=' + id, // 将作业 ID 传递给表单
                            });
                        };

                        $('#search').click(function () {
                            var student = $('#studentName').val();
                            var homeworkType = $('#tbType').val();
                            var select=$('#isReadSelect').val();

                            // console.log(homeworkType);
                            // console.log(select);
                            // console.log(student);

                            table.reload('tableList', {
                                url: '/homeworkdetail/list',
                                method: 'post',
                                where: {
                                    student: student,
                                    select: select,
                                    homeworkType: homeworkType
                                },
                                page: {
                                    curr: 1 // 从第一页开始
                                },
                            });
                        });
                    });
            </script>


        </div>
    </div>
</div>
</body>
</html>